<template>
  <BaseMainSlot :show-btn-box="true">
    <template v-slot:btn-box>
      <ActionBar
        :page-no="24"
        :add-active="true"
        :del-active="delActive"
        :has-cancel="false"
        @add="showDialog"
        @del="del"
      />
    </template>
    <template v-slot:search-box>
      <SearchBox @search="search">
        <div class="seach-box">
          <div class="select-box-content">
            <div class="select-box-content-name">作业模板名称：</div>
            <el-input
              v-model="querylist.jobTemplateName"
              placeholder="请输入工序名称"
              clearable
            />
          </div>
        </div>
      </SearchBox>
    </template>
    <template v-slot:table-box>
      <tdtable
        :page="page"
        :title="title"
        :prop-list="propList"
        :show-select-column="showSelectColumn"
        :show-index-column="showIndexColumn"
        :table-data="tableData"
        @handleSizeChange="handleSizeChange"
        @handleCurrentChange="handleCurrentChange"
        @handleSelectionChange="handleSelectionChange"
      >
        <template v-slot:handler="{row}">
          <div v-if="row.jobTemplateNo" class="pointer" @click="edit(row)">
            <i class="el-icon-edit"></i>修改
          </div>
        </template>
        <template v-slot:existing="{row}">
          <span v-if="row.jobTemplateNo">{{ row.existing ? "有" : "无" }}</span>
        </template>
        <!-- <template v-slot:headerHandler>
          <el-button type="primary" class="botton" @click="showDialog">添加</el-button>
          <el-button type="primary" class="botton" @click="del">删除</el-button>
        </template>-->
      </tdtable>
    </template>
    <template v-slot:dialog>
      <AddDialog
        :show="show"
        :title-text="titleText"
        :options="options"
        :person-options="PersonOptions"
        :equip-options="equipOptions"
        :unit-options="UnitOptions"
        :data-item-id-options="dataItemIdOptions"
        :edit-data="formData"
        @closeDialog="closeDialog"
        @addEvent="addEvent"
        @changeEquip="changeEquip"
        @changePdtProcess="changePdtProcess"
      />
    </template>
  </BaseMainSlot>
</template>

<script>
import BaseMainSlot from "@/components/BaseMainSlot/newBaseMainSlot.vue";
import ActionBar from "@/components/ActionBar/index1.vue";
import tdtable from "@/components/table/index.vue";
import AddDialog from "./components/add-jobtemp-dialog.vue";
import SearchBox from "@/components/SearchBox/index.vue";
import processManageApi from "@/api/processing-management/basic-info-manage/process-manage/index";
import jobTemplateApi from "@/api/processing-management/basic-info-manage/job-template-manage/index";
import UnitApi from "@/api/processing-management/basic-info-manage/data-item-manage/index";
import EquipApi from "@/api/processing-management/basic-info-manage/equip-config-dataitem/index";
export default {
  name: "JobTemplateManage",
  components: { BaseMainSlot, tdtable, AddDialog, SearchBox, ActionBar },
  data() {
    return {
      delActive: false,
      querylist: {
        jobTemplateName: ""
      },
      page: {
        currentPage: 1,
        pageSize: 10,
        total: 0
      },
      formData: {},
      options: [],
      PersonOptions: [],
      equipOptions: [],
      dataItemIdOptions: [],
      UnitOptions: [],
      title: "作业模板管理列表",
      propList: [
        { prop: "jobTemplateName", label: "作业模板名称", minWidth: "80" },
        { prop: "productionProcessesName", label: "关联工序", minWidth: "80" },
        {
          prop: "existing",
          label: "工艺参数",
          minWidth: "80",
          slotName: "existing"
        },
        { prop: "personName", label: "作业人", minWidth: "100" },
        { label: "操作", minWidth: "120", slotName: "handler" }
      ],
      showIndexColumn: true,
      showSelectColumn: true,
      tableData: [],
      titleText: "作业模板管理",
      show: false,
      handle: "add"
    };
  },
  computed: {},
  watch: {},
  mounted() {
    this.getOptions();
    this.getPersonOptions();
    this.getUnitOptions();
    this.queryPageList();
  },
  methods: {
    search() {
      this.queryPageList();
    },
    // 获取工序选择数组
    getOptions() {
      processManageApi.queryByConditionList().then(res => {
        if (res.code === 1) {
          let list = [];
          // 提供表头搜索数据
          res.data.forEach(item => {
            list.push({
              name: item.productionProcessesName,
              value: item.productionProcessesNo
            });
          });
          this.options = list;
        }
      });
    },
    // 获取作业人数组
    getPersonOptions() {
      jobTemplateApi.queryPersonByCondition().then(res => {
        if (res.code === 1) {
          let list = [];
          res.data.forEach(item => {
            list.push({
              name: item.person.name,
              value: item.person.personNo
            });
          });
          this.PersonOptions = list;
        }
      });
    },
    // 获取单位选择项
    getUnitOptions() {
      UnitApi.queryUnit().then(res => {
        if (res.code === 1) {
          let list = [];
          res.data.forEach(item => {
            list.push({
              name: item.unitName,
              value: item.unitNo
            });
          });
          this.UnitOptions = list;
        }
      });
    },
    //
    // 工序变化，获取对应的设备
    changePdtProcess(val) {
      processManageApi.queryEquipByNo(val).then(res => {
        if (res.code === 1) {
          let list = [];
          res.data.forEach(item => {
            list.push({
              name: item.equipmentName,
              value: item.equipmentCode
            });
          });
          this.equipOptions = list;
        }
      });
    },
    // 设备变化获取对应设备选择项
    getDataItemIdOptions(val) {
      EquipApi.queryByEquip(val).then(res => {
        if (res.code === 1) {
          let list = [];
          res.data.forEach(item => {
            list.push({
              name: item.dataItemName,
              value: item.dataItemId
            });
          });
          this.dataItemIdOptions = list;
        }
      });
    },
    // 重新获取设备数据选择项
    changeEquip(val) {
      this.getDataItemIdOptions(val);
    },
    handleSizeChange(val) {
      this.page.pageSize = val;
      this.queryPageList();
    },

    handleCurrentChange(val) {
      this.page.currentPage = val;
      this.queryPageList();
    },
    // 选中table行点击事件
    handleSelectionChange(val) {
      console.log(val);
      this.handleSelectList = [];
      val.forEach(e => {
        this.handleSelectList.push(e.jobTemplateNo);
      });
      if (this.handleSelectList.length > 0) {
        this.delActive = true;
      } else {
        this.delActive = false;
      }
    },
    queryPageList() {
      // 获取数据
      let param = {
        page: this.page.currentPage,
        size: this.page.pageSize,
        entity: this.querylist
      };
      jobTemplateApi.queryPageList(param).then(res => {
        if (res.code === 1) {
          let data = res.data;
          this.page.total = data.totalElements;
          this.tableData = data.content;
        }
      });
    },
    // 添加物料
    addEvent(formData) {
      let params = formData;
      if (this.handle === "add") {
        jobTemplateApi.add(params).then(res => {
          console.log(res);
          if (res.code === 1) {
            this.$message.success(res.msg);
            this.queryPageList();
          }
        });
      }
      if (this.handle === "edit") {
        jobTemplateApi.edit(params).then(res => {
          console.log(res);
          if (res.code === 1) {
            this.$message.success(res.msg);
            this.queryPageList();
          }
        });
      }
    },
    del() {
      let params = {
        noList: this.handleSelectList
      };
      this.$confirm("此操作将永久删除该项, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        customClass: "myClass"
      })
        .then(() => {
          jobTemplateApi.del(params).then(res => {
            if (res.code === 1) {
              this.$message.success(res.msg);
              this.queryPageList();
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },
    edit(row) {
      this.show = true;
      this.handle = "edit";
      console.log(row);
      this.changePdtProcess(row.productionProcessesNo);
      // this.getDataItemIdOptions(row.)
      this.formData = { ...row };
    },
    // 显示添加弹出框
    showDialog() {
      this.show = true;
    },
    closeDialog() {
      this.show = false;
      this.formData = {
        craftList: [
          {
            source: "",
            dataItemId: "",
            craftName: "",
            unitNo: ""
          }
        ]
      };
    }
  }
};
</script>

<style scoped lang="scss">
@import "~@/styles/variables.scss";
.botton {
  background-color: #0091b7;
}
</style>
